/******************************************************************************************
 * Import
 ******************************************************************************************/
import _ from 'lodash';
import React, {Component} from 'react';
import {View, TouchableHighlight, TouchableOpacity, Text} from 'react-native';
import CompEventContain from './contain';

/******************************************************************************************
 * Export Class
 ******************************************************************************************/
export default class CompEventContainer extends CompEventContain {

    /**
     * 初始化
     */
    constructor(props) {
        super(props);
        this.textStyles = this.getTextStyles();
    }

    /**
     * 获取text的styles
     */
    getTextStyles() {

        // 获取样式
        let textStyles = { textAlign: 'center'};
        if (this.styles.color) textStyles['color'] = this.styles.color;
        if (this.styles.fontSize) textStyles['fontSize'] = this.styles.fontSize;
        if (this.styles.fontWeight) textStyles['fontWeight'] = 'bold';

        // 删除原来在this.styles中的文字样式
        this.styles = _.omit(this.styles, ['color', 'fontSize', 'fontWeight']);

        // 返回
        return textStyles;
    }

    /**
	 * 渲染
	 */
	render() {
		if (this.hasEvent()) {
			if (this.getTouchControlType() == 'color') {
				this.setSysPropsColor();
				return (
                    <TouchableHighlight {...this.sysProps} style={this.styles}>
                        <Text style={this.textStyles}>
                            {this.props.children}
                        </Text>
                    </TouchableHighlight>
				);
			} else {
				this.setSysPropsOpacity();
				return (
					<TouchableOpacity {...this.sysProps} activeOpacity={0.7} style={this.styles}>
                        <Text style={this.textStyles}>
                            {this.props.children}
                        </Text>
                    </TouchableOpacity>
				);
			}
		}
		else {
			return (
				<View {...this.sysProps} style={this.styles}>
                    <Text style={this.textStyles}>
                        {this.props.children}
                    </Text>
                </View>
			);
		}		
	}
}
